<template>
  <div class="MailDoc">
    <header class="set-header">
      <span class="auto_title">归档文件夹</span>
      <el-button size="mini" type="primary" @click="append({})">
        +创建新文件夹
      </el-button>
    </header>
    <div class="gray"></div>
    <!--文件夹展示列表-->
    <DocTree ref="docTree" :folderList="folderList" :frag="1" @append="append" :getFolder="getFolder" v-if="reload"></DocTree>
    <!--新增文件夹-->
    <MailDocFolder ref="dialogFolder" @getFolder="getFolder"></MailDocFolder>
  </div>
</template>

<script>
    import DocTree from '@/components/mail/set/DocTree'
    import MailDocFolder from '@/views/common/dialog/MailDocFolder'
    import {queryFolder} from "@/api/mail/admin/mail-doc"

    export default {
        name: "MailDoc",
        components: {MailDocFolder, DocTree},
        data() {
            return {
                folderList: [],
                reload:false
            }
        },
        mounted() {
            this.getFolder();
            this.bus.$on('append', res => {
                this.append(res)
            })
            this.bus.$on('getList', res => {
                this.getFolder();
            })
        },
        methods: {
            //查询文件夹
            getFolder() {
                this.reload=false;
                queryFolder().then(res => {
                    this.folderList = res.data.data;
                    this.$nextTick(()=>{
                        this.reload=true
                    })
                });
            },
            append(params) {
                if (this.$refs.dialogFolder) {
                    this.$refs.dialogFolder.init(params);
                }
            }
        },
        beforeDestroy() {
            this.bus.$off('append')
            this.bus.$off('getList')
        }
    }
</script>

<style scoped lang="scss">
  $normalSize: 14px;
  $activeColor: #2A97F9;
  $bgColor: #E9F3FD;
  .MailDoc {

    .title {
      color: $activeColor;
      font-size: $normalSize;
      line-height: 35px;
      padding-left: 30px;
      background: #eaf0f6;

      span {
        color: #325893;
        margin-left: 15px;
        cursor: pointer;
      }
    }

  }
</style>
